<template>
	<view class="after-sale-detail-container page-container">
		<!-- 状态卡片 -->
		<view class="status-card">
			<view class="status-info">
				<text class="status-title">{{ afterSaleInfo.after_sale_status_desc }}</text>
				<text class="status-desc">{{ getStatusDesc(afterSaleInfo.after_sale_status) }}</text>
			</view>
		</view>

		<!-- 售后信息 -->
		<view class="info-card">
			<view class="card-title">售后信息</view>
			<view class="info-list">
				<view class="info-item">
					<text class="info-label">售后单号</text>
					<text class="info-value">{{ afterSaleInfo.after_sale_sn }}</text>
				</view>
				<view class="info-item">
					<text class="info-label">申请时间</text>
					<text class="info-value">{{ afterSaleInfo.apply_time }}</text>
				</view>
				<view class="info-item">
					<text class="info-label">售后类型</text>
					<text class="info-value">{{ getTypeTitle(afterSaleInfo.after_sale_type) }}</text>
				</view>
				<view class="info-item">
					<text class="info-label">售后原因</text>
					<text class="info-value">{{ afterSaleInfo.reason }}</text>
				</view>
				<view class="info-item">
					<text class="info-label">售后金额</text>
					<text class="info-value amount">¥{{ afterSaleInfo.refund_total_amount }}</text>
				</view>
			</view>
		</view>

		<!-- 商品信息 -->
		<view class="info-card">
			<block v-for="product in afterSaleInfo.sku_info" :key="product.id">
				<view class="card-title">商品信息</view>
				<view class="product-info">
					<image :src="$tools.buildUrl(product.main_image)" mode="aspectFill" class="product-image"></image>
					<view class="product-detail">
						<text class="product-name">{{ product.spu_name }}</text>
						<text class="product-spec">{{ product.sku_name }}</text>
						<text class="product-price">¥{{ product.actual_price }}</text>
						<text class="product-price" style="margin-left: 8px;">共{{ product.quantity }}件</text>
					</view>
				</view>
			</block>
		</view>

		<!-- 问题描述 -->
		<view class="info-card" v-if="afterSaleInfo.reason_remark">
			<view class="card-title">问题描述</view>
			<text class="description-text">{{ afterSaleInfo.reason_remark }}</text>
		</view>

		<!-- 上传图片 -->
		<view class="info-card" v-if="afterSaleInfo.evidence && afterSaleInfo.evidence.length > 0">
			<view class="card-title">问题图片</view>
			<view class="image-list">
				<image v-for="(image, index) in afterSaleInfo.evidence" :key="index" :src="$tools.buildUrl(image)"
					mode="aspectFill" class="problem-image" @click="previewImage(image)"></image>
			</view>
		</view>

		<!-- 处理进度 -->
		<view class="info-card">
			<view class="card-title">处理进度</view>
			<view class="progress-list">
				<view class="progress-item" v-for="(progress, index) in afterSaleInfo.progressList" :key="index"
					:class="{active:progress.active}">
					<view class="progress-dot"></view>
					<view class="progress-content">
						<text class="progress-title">{{ progress.optname }}</text>
						<text class="progress-time">{{ progress.operate_time }}</text>
						<text class="progress-desc" v-if="progress.comment">{{ progress.comment }}</text>
					</view>
				</view>
			</view>
		</view>

		<view class="return-address-card"
			v-if="(afterSaleInfo.return_tracking_no && afterSaleInfo.return_tracking_no!=='') || (afterSaleInfo.pickup_date && afterSaleInfo.pickup_date!=='')">
			<view class="card-title">
				<text class="title-text">📦 买家退货信息</text>
				<text class="version-tag">{{getReturnTitle(afterSaleInfo.return_type)}}</text>
			</view>
			<view v-if="afterSaleInfo.return_type===1" class="address-info">
				<view class="address-item">
					<text class="address-label">物流单号：</text>
					<text class="address-value">{{ afterSaleInfo.return_tracking_no }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">物流公司：</text>
					<text class="address-value">{{ afterSaleInfo.return_lc_name }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">上传时间：</text>
					<text class="address-value">{{ afterSaleInfo.return_logistics_time }}</text>
				</view>
			</view>
			<view v-else class="address-info">
				<view class="address-item">
					<text class="address-label">上门取件：</text>
					<text class="address-value">{{ afterSaleInfo.pickup_date }} {{ afterSaleInfo.pickup_time }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">取件备注：</text>
					<text class="address-value">{{ afterSaleInfo.pickup_remark }}</text>
				</view>
			</view>
		</view>

		<view class="return-address-card"
			v-if="afterSaleInfo.exchange_tracking_no && afterSaleInfo.exchange_tracking_no!==''">
			<view class="card-title">
				<text class="title-text">📦 卖家换货物流</text>
			</view>
			<view class="address-info">
				<view class="address-item">
					<text class="address-label">物流单号：</text>
					<text class="address-value">{{ afterSaleInfo.exchange_tracking_no }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">物流公司：</text>
					<text class="address-value">{{ afterSaleInfo.exchange_lc_name }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">发货时间：</text>
					<text class="address-value">{{ afterSaleInfo.exchange_logistics_time }}</text>
				</view>
			</view>
		</view>

		<view class="return-address-card"
			v-if="afterSaleInfo.resend_tracking_no && afterSaleInfo.resend_tracking_no!==''">
			<view class="card-title">
				<text class="title-text">📦 卖家补寄物流</text>
			</view>
			<view class="address-info">
				<view class="address-item">
					<text class="address-label">物流单号：</text>
					<text class="address-value">{{ afterSaleInfo.resend_tracking_no }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">物流公司：</text>
					<text class="address-value">{{ afterSaleInfo.resend_lc_name }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">发货时间：</text>
					<text class="address-value">{{ afterSaleInfo.resend_logistics_time }}</text>
				</view>
			</view>
		</view>

		<view class="return-address-card"
			v-if="afterSaleInfo.order_tracking_no && afterSaleInfo.order_tracking_no!==''">
			<view class="card-title">
				<text class="title-text">📦 卖家正向物流</text>
			</view>
			<view class="address-info">
				<view class="address-item">
					<text class="address-label">物流单号：</text>
					<text class="address-value">{{ afterSaleInfo.order_tracking_no }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">物流公司：</text>
					<text class="address-value">{{ afterSaleInfo.order_lc_name }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">到达时间：</text>
					<text class="address-value">{{ afterSaleInfo.order_logistics_time }}</text>
				</view>
			</view>
		</view>

		<!-- 1.0版本：自行退货 退货地址信息 -->
		<view class="return-address-card" v-if="[1,3].includes(afterSaleInfo.after_sale_status) && return_type === 1">
			<view class="card-title">
				<text class="title-text">📦 退货地址信息</text>
				<text class="version-tag">自行退货</text>
			</view>
			<view class="address-info">
				<view class="address-item">
					<text class="address-label">收件人：</text>
					<text class="address-value">{{ afterSaleInfo.return_name }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">联系电话：</text>
					<text class="address-value phone" @click="makeCall(afterSaleInfo.return_phone)">
						{{ afterSaleInfo.return_phone }}
					</text>
				</view>
				<view class="address-item">
					<text class="address-label">退货地址：</text>
					<text class="address-value">{{ afterSaleInfo.return_pcs+' '+afterSaleInfo.return_address }}</text>
				</view>
				<view class="address-item">
					<text class="address-label">邮政编码：</text>
					<text class="address-value">{{ afterSaleInfo.return_zipCode }}</text>
				</view>
			</view>
			<view class="address-note">
				<text class="note-icon">💡</text>
				<text class="note-text">请按照以上地址进行退货，并上传物流信息</text>
			</view>
			<view class="pickup-actions">
				<button class="action-btn pickup-btn" @click="copyAddress">
					复制地址
				</button>
				<button class="action-btn self-return-btn" @click="goToSelfPickupPage">
					上传物流单
				</button>
			</view>
		</view>

		<!-- 2.0版本：上门取件选项 -->
		<view class="pickup-option-card" v-if="[1,3].includes(afterSaleInfo.after_sale_status)">
			<view class="card-title">
				<text class="title-text">🚚 上门取件服务</text>
			</view>
			<view class="pickup-info">
				<text class="pickup-desc">{{pickupInfo.note}}</text>
			</view>
			<view class="pickup-actions">
				<button class="action-btn pickup-btn" :disabled="!pickupInfo.available" @click="goToPickupPage">
					预约上门取件
				</button>
				<button class="action-btn self-return-btn" @click="chooseSelfReturn">
					自行退货
				</button>
			</view>
		</view>

		<!-- 审核结果信息 -->
		<view class="audit-result-card" v-if=" [2,4].includes(afterSaleInfo.check_status)">
			<view class="card-title">
				<text class="title-text">❌ 审核结果</text>
			</view>
			<view class="audit-info">
				<view class="audit-item" v-if="afterSaleInfo.check_time">
					<text class="audit-label">审核时间：</text>
					<text class="audit-value">{{ afterSaleInfo.check_time }}</text>
				</view>
				<view class="audit-item" v-if="afterSaleInfo.chack_reason">
					<text class="audit-label">拒绝原因：</text>
					<text class="audit-value">{{ afterSaleInfo.chack_reason }}</text>
				</view>
				<view class="audit-item" v-if="afterSaleInfo.check_remark">
					<text class="audit-label">审核备注：</text>
					<text class="audit-value">{{ afterSaleInfo.check_remark }}</text>
				</view>
			</view>
		</view>

		<!-- 联系客服 -->
		<view class="contact-section">
			<button class="contact-btn" open-type="contact" @contact="handleContact">
				联系客服
			</button>
		</view>

		<!-- 操作按钮 -->
		<view class="action-section" v-if="afterSaleInfo.after_sale_status === 0">
			<button class="action-btn cancel-btn" @click="cancelAfterSale">
				撤销申请
			</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				afterSaleId: '',
				afterSaleInfo: {},
				// 自行退货信息（1.0版本） 寄回类型：1-自行寄回，2-上门取件
				return_type: 2,
				// 上门取件信息（2.0版本）
				pickupInfo: {
					available: true, // 是否支持上门取件
					timeSlots: ['09:00-12:00', '14:00-18:00'],
					note: '我们将在您选择的时间段内安排专人上门取件'
				}
			}
		},
		onLoad(options) {
			if (options.id) {
				this.afterSaleId = options.id
				this.loadAfterSaleDetail()
			}
		},
		methods: {
			onSearch() {
				if (this.afterSaleId) {
					this.loadAfterSaleDetail()
				}
			},
			// 加载售后详情
			loadAfterSaleDetail() {
				this.$api.order.GetAfterSalesInfo({
					id: this.afterSaleId
				}).then(res => {
					res.data.sku_info = this.$tools.parseJsonObject(res.data.sku_info)
					res.data.evidence = this.$tools.parseJsonObject(res.data.evidence)
					const province = this.$tools.parseJsonObject(res.data.return_province)
					const city = this.$tools.parseJsonObject(res.data.return_city)
					const town = this.$tools.parseJsonObject(res.data.return_town)
					if (province && province.name) {
						res.data.return_pcs = province.name + city.name + town.name;
					} else {
						res.data.return_pcs = '';
					}
					this.return_type = res.data.return_type > 0 ? res.data.return_type : 2;
					this.afterSaleInfo = res.data;
					this.afterSaleInfo.progressList.forEach(item => {
						item.active = true;
					})
					if ([3, 4].includes(this.afterSaleInfo.after_sale_status)) {
						this.afterSaleInfo.progressList.push({
							optname: this.getStatusTitle(this.afterSaleInfo.after_sale_status),
							operate_time: '',
							comment: this.getStatusDesc(this.afterSaleInfo.after_sale_status),
							active: false
						})
					}
				})
			},

			// 获取状态图标
			// 售后状态：0-售后申请(待审核) 1-同意申请 2-拒绝申请 3-售后待用户发货(退货/换货) 4-售后待商家发货(补寄) 
			// 5-售后用户已发货,待商家收货 6-售后商家已发货,待用户收货 7-售后商家已收货 8-售后用户已收货 9-售后成功 10-售后失败 11-用户取消售后
			getStatusIcon(status) {
				const iconMap = {
					0: '⏳',
					1: '✅',
					2: '❌',
					3: '⏳',
					4: '⏳',
					5: '⏳',
					6: '⏳',
					7: '⏳',
					8: '⏳',
					9: '🎉',
					10: '❌',
					11: '❌'
				}
				return iconMap[status] || '❓'
			},

			// 获取退货方式
			getReturnTitle(type) {
				const titleMap = {
					1: '自行寄回',
					2: '上门取件'
				}
				return titleMap[type] || '自行寄回'
			},

			// 获取售后类型
			getTypeTitle(type) {
				const titleMap = {
					1: '退货',
					2: '换货',
					3: '仅退款',
					4: '补寄'
				}
				return titleMap[type] || '未知'
			},

			// 获取状态标题
			getStatusTitle(status) {
				const titleMap = {
					0: '商家审核中',
					1: '商家已同意',
					2: '商家已拒绝',
					3: '待用户发货',
					4: '待商家发货',
					5: '用户已发货,待商家收货',
					6: '商家已发货,待用户收货',
					7: '商家已签收',
					8: '用户已签收',
					9: '售后已完成',
					10: '售后失败',
					11: '用户取消售后'
				}
				return titleMap[status] || '未知状态'
			},

			// 获取状态描述
			getStatusDesc(status) {
				const descMap = {
					0: '商家正在审核您的售后申请，请耐心等待审核结果',
					1: '您的售后申请已通过审核',
					2: '很抱歉，您的售后申请未通过审核，如有疑问请联系客服',
					3: '您的售后申请已通过审核，请按照下方指引进行退货操作',
					4: '您的售后申请已通过审核，请耐心等待商家发货',
					5: '用户的售后商品已经寄出，等待商家签收',
					6: '商家已发货,请耐心等待',
					7: '商家已签收',
					8: '用户已签收',
					9: '售后处理已完成，感谢您的理解与支持',
					10: '售后失败，如有疑问请联系客服',
					11: '用户已经取消本次售后申请'
				}
				return descMap[status] || '我们会尽快处理，请您耐心等待'
			},

			// 预览图片
			previewImage(current) {
				let newUrls = []
				this.afterSaleInfo.evidence.forEach(image => {
					newUrls.push(this.$tools.buildUrl(image))
				})
				uni.previewImage({
					current: this.$tools.buildUrl(current),
					urls: newUrls
				})
			},

			// 处理微信客服
			handleContact(e) {
				// console.log('客服消息：', e.detail)
				// 可以在这里处理客服会话的相关逻辑
				if (e.detail.errMsg === 'contact:ok') {
					// console.log('用户进入客服会话')
				}
			},

			// 撤销售后申请
			cancelAfterSale() {
				uni.showModal({
					title: '撤销申请',
					content: '确定要撤销这个售后申请吗？',
					success: (res) => {
						if (res.confirm) {
							uni.showLoading({
								title: '处理中...'
							})
							this.$api.order.CancelAfterSales({
								after_sales_id: this.afterSaleId
							}).then(res => {
								uni.hideLoading()
								uni.showToast({
									title: res.msg,
									icon: 'success'
								})
								this.afterSaleInfo.after_sale_status = 11
								this.afterSaleInfo.after_sale_status_desc = '已取消'
								const pages = getCurrentPages()
								const prevPage = pages[pages.length - 2]
								if (prevPage) {
									prevPage.$vm.setOrderStatus(this.afterSaleId, this.afterSaleInfo
										.after_sale_status, this.afterSaleInfo
										.after_sale_status_desc)
								}
								setTimeout(() => {
									uni.navigateBack()
								}, 1500)
							})
						}
					}
				})
			},

			// 拨打电话
			makeCall(phone) {
				uni.makePhoneCall({
					phoneNumber: phone,
					fail: (err) => {
						uni.showToast({
							title: '拨打失败',
							icon: 'none'
						})
					}
				})
			},

			// 复制地址
			copyAddress() {
				const address =
					`收件人：${this.afterSaleInfo.return_name}\n联系电话：${this.afterSaleInfo.return_phone}\n退货地址：${this.afterSaleInfo.return_pcs+' '+this.afterSaleInfo.return_address}\n邮政编码：${this.afterSaleInfo.return_zipCode}`

				uni.setClipboardData({
					data: address,
					success: () => {
						uni.showToast({
							title: '地址已复制',
							icon: 'success'
						})
					},
					fail: () => {
						uni.showToast({
							title: '复制失败',
							icon: 'none'
						})
					}
				})
			},

			// 跳转到自行寄件页面（1.0版本）
			goToSelfPickupPage() {
				uni.navigateTo({
					url: `/pages/after-sale/pickup-self?afterSaleId=${this.afterSaleId}`
				})
			},

			// 跳转到上门取件页面（2.0版本）
			goToPickupPage() {
				uni.navigateTo({
					url: `/pages/after-sale/pickup?afterSaleId=${this.afterSaleId}`
				})
			},

			// 选择自行退货
			chooseSelfReturn() {
				uni.showModal({
					title: '选择自行退货',
					content: '您选择自行退货，我们将为您提供退货地址信息',
					success: (res) => {
						if (res.confirm) {
							// 切换到1.0版本显示
							this.return_type = 1
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.after-sale-detail-container {
		background-color: #f8f9fa;
	}

	/* 状态卡片 */
	.status-card {
		background: linear-gradient(135deg, #52a58a 0%, #6bb6a3 100%);
		margin: 20rpx;
		border-radius: 20rpx;
		padding: 40rpx;
		display: flex;
		align-items: center;
		color: white;
	}

	.status-icon {
		font-size: 60rpx;
		margin-right: 30rpx;
	}

	.status-info {
		flex: 1;
	}

	.status-title {
		font-size: 36rpx;
		font-weight: bold;
		display: block;
		margin-bottom: 12rpx;
	}

	.status-desc {
		font-size: 26rpx;
		opacity: 0.9;
		line-height: 1.4;
	}

	/* 信息卡片 */
	.info-card {
		background: white;
		margin: 20rpx;
		border-radius: 16rpx;
		padding: 30rpx;
		box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
	}

	.card-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
		margin-bottom: 30rpx;
	}

	/* 信息列表 */
	.info-list {}

	.info-item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20rpx 0;
		border-bottom: 1rpx solid #f0f0f0;
	}

	.info-item:last-child {
		border-bottom: none;
	}

	.info-label {
		font-size: 28rpx;
		color: #666;
	}

	.info-value {
		font-size: 28rpx;
		color: #333;
		text-align: right;
		flex: 1;
		margin-left: 20rpx;
	}

	.info-value.amount {
		color: #52a58a;
		font-weight: bold;
	}

	/* 商品信息 */
	.product-info {
		display: flex;
		align-items: center;
	}

	.product-image {
		width: 120rpx;
		height: 120rpx;
		border-radius: 12rpx;
		margin-right: 20rpx;
	}

	.product-detail {
		flex: 1;
	}

	.product-name {
		font-size: 28rpx;
		color: #333;
		font-weight: bold;
		display: block;
		margin-bottom: 8rpx;
	}

	.product-spec {
		font-size: 24rpx;
		color: #999;
		display: block;
		margin-bottom: 8rpx;
	}

	.product-price {
		font-size: 26rpx;
		color: #52a58a;
		font-weight: bold;
	}

	/* 问题描述 */
	.description-text {
		font-size: 28rpx;
		color: #333;
		line-height: 1.6;
	}

	/* 退货地址卡片 */
	.return-address-card,
	.pickup-option-card,
	.audit-result-card {
		background-color: #ffffff;
		margin: 20rpx;
		border-radius: 16rpx;
		padding: 40rpx;
		box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
	}

	.card-title {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 30rpx;
	}

	.title-text {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
	}

	.version-tag {
		background-color: #52a58a;
		color: #ffffff;
		font-size: 20rpx;
		padding: 8rpx 16rpx;
		border-radius: 20rpx;
	}

	/* 地址信息 */
	.address-info {
		margin-bottom: 30rpx;
	}

	.address-item {
		display: flex;
		margin-bottom: 20rpx;
		align-items: flex-start;
	}

	.address-label {
		font-size: 28rpx;
		color: #666;
		width: 160rpx;
		flex-shrink: 0;
	}

	.address-value {
		font-size: 28rpx;
		color: #333;
		flex: 1;
		line-height: 1.4;
	}

	.address-value.phone {
		color: #52a58a;
		text-decoration: underline;
	}

	/* 地址备注 */
	.address-note {
		background-color: #f8f9fa;
		padding: 20rpx;
		border-radius: 12rpx;
		margin-bottom: 30rpx;
		display: flex;
		align-items: flex-start;
	}

	.note-icon {
		font-size: 28rpx;
		margin-right: 12rpx;
		flex-shrink: 0;
	}

	.note-text {
		font-size: 26rpx;
		color: #666;
		line-height: 1.5;
		flex: 1;
	}

	/* 地址操作按钮 */
	.address-actions {
		display: flex;
		justify-content: center;
	}

	.copy-btn {
		background-color: #52a58a;
		color: #ffffff;
		border: none;
		border-radius: 50rpx;
		padding: 20rpx 60rpx;
		font-size: 28rpx;
	}

	/* 操作按钮 */
	.action-section {
		padding: 0 30rpx;
	}

	.action-btn {
		width: 100%;
		height: 88rpx;
		border: none;
		border-radius: 44rpx;
		font-size: 32rpx;
		font-weight: bold;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.cancel-btn {
		background: #f8f9fa;
		color: #666;
		border: 2rpx solid #e5e5e5;
	}

	/* 上门取件信息 */
	.pickup-info {
		margin-bottom: 30rpx;
	}

	.pickup-desc {
		font-size: 28rpx;
		color: #666;
		line-height: 1.5;
	}

	.pickup-actions {
		display: flex;
		gap: 20rpx;
	}

	.pickup-btn {
		flex: 1;
		background-color: #52a58a;
		color: #ffffff;
		border: none;
		border-radius: 50rpx;
		padding: 24rpx;
		font-size: 28rpx;
	}

	.self-return-btn {
		flex: 1;
		background-color: #ffffff;
		color: #52a58a;
		border: 2rpx solid #52a58a;
		border-radius: 50rpx;
		padding: 24rpx;
		font-size: 28rpx;
	}

	/* 审核结果信息 */
	.audit-info {
		margin-bottom: 20rpx;
	}

	.audit-item {
		display: flex;
		margin-bottom: 20rpx;
		align-items: flex-start;
	}

	.audit-label {
		font-size: 28rpx;
		color: #666;
		width: 160rpx;
		flex-shrink: 0;
	}

	.audit-value {
		font-size: 28rpx;
		color: #333;
		flex: 1;
		line-height: 1.4;
	}

	/* 图片列表 */
	.image-list {
		display: flex;
		flex-wrap: wrap;
		gap: 20rpx;
	}

	.problem-image {
		width: 160rpx;
		height: 160rpx;
		border-radius: 12rpx;
		object-fit: cover;
	}

	/* 处理进度 */
	.progress-list {}

	.progress-item {
		display: flex;
		align-items: flex-start;
		position: relative;
		padding-bottom: 40rpx;
	}

	.progress-item:last-child {
		padding-bottom: 0;
	}

	.progress-item:not(:last-child)::after {
		content: '';
		position: absolute;
		left: 20rpx;
		top: 40rpx;
		bottom: 0;
		width: 2rpx;
		background-color: #e5e5e5;
	}

	.progress-item.active .progress-dot {
		background-color: #52a58a;
		border-color: #52a58a;
	}

	.progress-item.active::after {
		background-color: #52a58a;
	}

	.progress-dot {
		width: 40rpx;
		height: 40rpx;
		border: 4rpx solid #e5e5e5;
		border-radius: 50%;
		background-color: white;
		margin-right: 30rpx;
		flex-shrink: 0;
		margin-top: 4rpx;
	}

	.progress-content {
		flex: 1;
	}

	.progress-title {
		font-size: 28rpx;
		color: #333;
		font-weight: bold;
		display: block;
		margin-bottom: 8rpx;
	}

	.progress-time {
		font-size: 24rpx;
		color: #999;
		display: block;
		margin-bottom: 8rpx;
	}

	.progress-desc {
		font-size: 26rpx;
		color: #666;
		line-height: 1.4;
	}

	/* 联系客服 */
	.contact-section {
		padding: 30rpx;
	}

	.contact-btn {
		width: 100%;
		height: 80rpx;
		background: white;
		color: #52a58a;
		border: 2rpx solid #52a58a;
		border-radius: 40rpx;
		font-size: 28rpx;
		font-weight: bold;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.contact-btn::after {
		border: none;
	}
</style>